<template>
    <el-container>
        <el-aside width="180px">
            <el-menu >
                <el-menu-item @click="onSeletType(item.id)" :index="item.id" :key="item.id" v-for="item in typeData">
                    <el-badge :show-zero="false" :value="item.value" class="item"><el-text>{{item.title}}</el-text></el-badge>
                </el-menu-item>
            </el-menu>
        </el-aside>
        <el-main class="pt0">
            <component v-if="form.model == 'Leave'" :is="leave" />
            <component v-if="form.model == 'Stamp'" :is="stamp" />
            <component v-if="form.model == 'Cert'" :is="cert" />
            <component v-if="form.model == 'Material'" :is="material" />
            <component v-if="form.model == 'MaterialContract'" :is="materialContract" />
            <component v-if="form.model == 'Labor'" :is="labor" />
            <component v-if="form.model == 'LaborContract'" :is="laborContract" />
            <component v-if="form.model == 'WarehousesIn'" :is="warehousesIn" />
            <component v-if="form.model == 'WarehousesOut'" :is="warehousesOut" />
        </el-main>
    </el-container>
</template>

<script lang="ts" setup>
import { onMounted, ref } from 'vue'
import leave from './approve/leave.vue';
import stamp from './approve/stamp.vue';
import cert from './approve/cert.vue';
import material from './approve/material.vue';
import materialContract from './approve/materialContract.vue';
import labor from './approve/labor.vue';
import laborContract from './approve/laborContract.vue';
import warehousesIn from './approve/warehousesIn.vue';
import warehousesOut from './approve/warehousesOut.vue';
import http from '../../../util/request';
const form = ref<any>({search:'',model:'Leave',page:0,current:0,total:10,limit:20,loading:false,parentBorder:false})
const typeData = ref<any>([
    {title:'材料采购',id:'Material',value:0},
    {title:'材料合同',id:'MaterialContract',value:0},
    // {title:'材料比价',id:'MaterialContrast',value:0},
    {title:'施工班组',id:'Labor',value:0},
    {title:'施工班组合同',id:'LaborContract',value:0},
    {title:'资料下载申请',id:'Cert',value:0},
    {title:'用章申请',id:'Stamp',value:0},
    {title:'请假申请',id:'Leave',value:0},
    {title:'入库申请',id:'WarehousesIn',value:0},
    {title:'出库申请',id:'WarehousesOut',value:0},
    // {title:'施工班组比价',id:'LaborContrast'},
])

const onSeletType = (data:string) => {
    form.value.model = data
}

const onGetData = () => {
    http.post('/approve/wait',form.value).then((response:any)=>{
        console.log(response)
    })
}

onMounted(()=>{
    onGetData()
})

</script>

<style scoped>

</style>